// base color
$blue: #324157;
$light-blue: #3A71A8;
$red: #C03639;
$pink: #E65D6E;
$green: #30B08F;
$tiffany: #4AB7BD;
$yellow: #FEC171;
$panGreen: #30B08F;

// 默认菜单主题风格
$base-menu-color: #bfcbd9;
$base-menu-color-active: #f4f4f5;
$base-menu-background: rgb(39, 47, 64);
$base-logo-title-color: #ffffff;

$base-menu-light-color: rgba(0, 0, 0, 0.7);
$base-menu-light-background: #ffffff;
$base-logo-light-title-color: #001529;

$base-sub-menu-background: #1f2d3d;
$base-sub-menu-hover: #001528;

// 自定义暗色菜单风格
/**
$base-menu-color:hsla(0,0%,100%,.65);
$base-menu-color-active:#fff;
$base-menu-color:#001529;
$base-logo-title-color: #ffffff;

$base-menu-light-color:rgba(0,0,0,.70);
$base-menu-light-background:#ffffff;
$base-logo-light-title-color: #001529;

$base-sub-menu-background:#000c17;
$base-sub-menu-hover:#001528;
*/

$--color-primary: #409EFF;
$--color-success: #67C23A;
$--color-warning: #E6A23C;
$--color-danger: #F56C6C;
$--color-info: #909399;
$--color-function3: #F3F6FB;
$--border-color-base: #D8DDE3; // 边框色
$--background-color-base: #F8FAFD; // 背景色
$--color-black: #000000; // 基础黑
$base-sidebar-width: 200px;
$--color-text-primary: #333333; // 主要文字

// Ant Design 基础色板
$red-1: #fff1f0;
$red-2: #ffccc7;
$red-3: #ffa39e;
$red-4: #ff7875;
$red-5: #ff4d4f;
$red-6: #f5222d;
$red-7: #cf1322;
$red-8: #a30f1e;
$red-9: #7d0f1a;
$red-10: #5a0d12;

$volcano-1: #fffbe6;
$volcano-2: #ffefc8;
$volcano-3: #ffd591;
$volcano-4: #ffc966;
$volcano-5: #ffa940;
$volcano-6: #d48806;
$volcano-7: #a06000;
$volcano-8: #7a4800;
$volcano-9: #5d3600;
$volcano-10: #452a00;

$orange-1: #fff7e6;
$orange-2: #ffe7ba;
$orange-3: #ffd591;
$orange-4: #ffac33;
$orange-5: #ff9900;
$orange-6: #e68a00;
$orange-7: #b76e00;
$orange-8: #8e5700;
$orange-9: #6a4400;
$orange-10: #4b3200;

$gold-1: #fffbe6;
$gold-2: #fff3c8;
$gold-3: #ffeb96;
$gold-4: #ffdf66;
$gold-5: #ffda33;
$gold-6: #fadb14;
$gold-7: #d4a612;
$gold-8: #ac8d0e;
$gold-9: #8a740a;
$gold-10: #675d08;

$yellow-1: #fffbed;
$yellow-2: #fff8d5;
$yellow-3: #fff5a6;
$yellow-4: #fff277;
$yellow-5: #ffeb3b;
$yellow-6: #fadb14;
$yellow-7: #d4a612;
$yellow-8: #ac8d0e;
$yellow-9: #8a740a;
$yellow-10: #675d08;

$lime-1: #f0f9eb;
$lime-2: #e6f7df;
$lime-3: #d9f7be;
$lime-4: #b7eb8f;
$lime-5: #95de64;
$lime-6: #73d13d;
$lime-7: #55a532;
$lime-8: #3e8625;
$lime-9: #2a6a1d;
$lime-10: #174e14;

$green-1: #f0f9eb;
$green-2: #e6f7df;
$green-3: #d9f7be;
$green-4: #b7eb8f;
$green-5: #95de64;
$green-6: #73d13d;
$green-7: #55a532;
$green-8: #3e8625;
$green-9: #2a6a1d;
$green-10: #174e14;

$cyan-1: #e6fffb;
$cyan-2: #d1faff;
$cyan-3: #a3f0f1;
$cyan-4: #78e6e9;
$cyan-5: #4fd0e9;
$cyan-6: #1890ff;
$cyan-7: #096dd9;
$cyan-8: #0050b3;
$cyan-9: #003a8c;
$cyan-10: #002766;

$blue-1: #e6f7ff;
$blue-2: #bae7ff;
$blue-3: #91d5ff;
$blue-4: #69c0ff;
$blue-5: #40a9ff;
$blue-6: #1890ff;
$blue-7: #096dd9;
$blue-8: #0050b3;
$blue-9: #003a8c;
$blue-10: #002766;

$geekblue-1: #e6f7ff;
$geekblue-2: #d9f0ff;
$geekblue-3: #b3d8ff;
$geekblue-4: #85c8ff;
$geekblue-5: #59a1ff;
$geekblue-6: #2d8cf0;
$geekblue-7: #0a70b1;
$geekblue-8: #0050b3;
$geekblue-9: #003a8c;
$geekblue-10: #002766;

$purple-1: #f9f0ff;
$purple-2: #f3d9ff;
$purple-3: #e4b8ff;
$purple-4: #d39eff;
$purple-5: #c284ff;
$purple-6: #b36aff;
$purple-7: #9254d9;
$purple-8: #723f9e;
$purple-9: #5d2e80;
$purple-10: #482262;

$magenta-1: #fff0f6;
$magenta-2: #ffdcf7;
$magenta-3: #fde2f9;
$magenta-4: #fbb1f7;
$magenta-5: #f783ac;
$magenta-6: #eb2f96;
$magenta-7: #c41d7f;
$magenta-8: #a11a63;
$magenta-9: #82174b;
$magenta-10: #651434;

// 中性色板
$gray-1: rgba(255, 255, 255, 0.38);
$gray-2: #fafafa;
$gray-3: #f5f5f5;
$gray-4: #f0f0f0;
$gray-5: #e5e5e5;
$gray-6: #d9d9d9;
$gray-7: #bfbfbf;
$gray-8: #8c8c8c;
$gray-9: #595959;
$gray-10: #333333;
$gray-11: #1f1f1f;
$gray-12: #000000;

// the :export directive is the magic sauce for webpack
// https://www.bluematador.com/blog/how-to-share-variables-between-js-and-sass
:export {
  menuColor: $base-menu-color;
  menuLightColor: $base-menu-light-color;
  menuColorActive: $base-menu-color-active;
  menuBackground: $base-menu-background;
  menuLightBackground: $base-menu-light-background;
  subMenuBackground: $base-sub-menu-background;
  subMenuHover: $base-sub-menu-hover;
  sideBarWidth: $base-sidebar-width;
  logoTitleColor: $base-logo-title-color;
  logoLightTitleColor: $base-logo-light-title-color;
  primaryColor: $--color-primary;
  successColor: $--color-success;
  dangerColor: $--color-danger;
  infoColor: $--color-info;
  warningColor: $--color-warning;

  // 导出Ant Design颜色变量
  red1: $red-1;
  red2: $red-2;
  red3: $red-3;
  red4: $red-4;
  red5: $red-5;
  red6: $red-6;
  red7: $red-7;
  red8: $red-8;
  red9: $red-9;
  red10: $red-10;

  volcano1: $volcano-1;
  volcano2: $volcano-2;
  volcano3: $volcano-3;
  volcano4: $volcano-4;
  volcano5: $volcano-5;
  volcano6: $volcano-6;
  volcano7: $volcano-7;
  volcano8: $volcano-8;
  volcano9: $volcano-9;
  volcano10: $volcano-10;

  orange1: $orange-1;
  orange2: $orange-2;
  orange3: $orange-3;
  orange4: $orange-4;
  orange5: $orange-5;
  orange6: $orange-6;
  orange7: $orange-7;
  orange8: $orange-8;
  orange9: $orange-9;
  orange10: $orange-10;

  gold1: $gold-1;
  gold2: $gold-2;
  gold3: $gold-3;
  gold4: $gold-4;
  gold5: $gold-5;
  gold6: $gold-6;
  gold7: $gold-7;
  gold8: $gold-8;
  gold9: $gold-9;
  gold10: $gold-10;

  yellow1: $yellow-1;
  yellow2: $yellow-2;
  yellow3: $yellow-3;
  yellow4: $yellow-4;
  yellow5: $yellow-5;
  yellow6: $yellow-6;
  yellow7: $yellow-7;
  yellow8: $yellow-8;
  yellow9: $yellow-9;
  yellow10: $yellow-10;

  lime1: $lime-1;
  lime2: $lime-2;
  lime3: $lime-3;
  lime4: $lime-4;
  lime5: $lime-5;
  lime6: $lime-6;
  lime7: $lime-7;
  lime8: $lime-8;
  lime9: $lime-9;
  lime10: $lime-10;

  green1: $green-1;
  green2: $green-2;
  green3: $green-3;
  green4: $green-4;
  green5: $green-5;
  green6: $green-6;
  green7: $green-7;
  green8: $green-8;
  green9: $green-9;
  green10: $green-10;

  cyan1: $cyan-1;
  cyan2: $cyan-2;
  cyan3: $cyan-3;
  cyan4: $cyan-4;
  cyan5: $cyan-5;
  cyan6: $cyan-6;
  cyan7: $cyan-7;
  cyan8: $cyan-8;
  cyan9: $cyan-9;
  cyan10: $cyan-10;

  blue1: $blue-1;
  blue2: $blue-2;
  blue3: $blue-3;
  blue4: $blue-4;
  blue5: $blue-5;
  blue6: $blue-6;
  blue7: $blue-7;
  blue8: $blue-8;
  blue9: $blue-9;
  blue10: $blue-10;

  geekblue1: $geekblue-1;
  geekblue2: $geekblue-2;
  geekblue3: $geekblue-3;
  geekblue4: $geekblue-4;
  geekblue5: $geekblue-5;
  geekblue6: $geekblue-6;
  geekblue7: $geekblue-7;
  geekblue8: $geekblue-8;
  geekblue9: $geekblue-9;
  geekblue10: $geekblue-10;

  purple1: $purple-1;
  purple2: $purple-2;
  purple3: $purple-3;
  purple4: $purple-4;
  purple5: $purple-5;
  purple6: $purple-6;
  purple7: $purple-7;
  purple8: $purple-8;
  purple9: $purple-9;
  purple10: $purple-10;

  magenta1: $magenta-1;
  magenta2: $magenta-2;
  magenta3: $magenta-3;
  magenta4: $magenta-4;
  magenta5: $magenta-5;
  magenta6: $magenta-6;
  magenta7: $magenta-7;
  magenta8: $magenta-8;
  magenta9: $magenta-9;
  magenta10: $magenta-10;

  gray1: $gray-1;
  gray2: $gray-2;
  gray3: $gray-3;
  gray4: $gray-4;
  gray5: $gray-5;
  gray6: $gray-6;
  gray7: $gray-7;
  gray8: $gray-8;
  gray9: $gray-9;
  gray10: $gray-10;
  gray11: $gray-11;
  gray12: $gray-12;
}

// 定义颜色变量
$approverCard: #73d13d; // 温和的绿色
$conditionCard: #1890ff; // 蓝色
$starterCard: #faad14; // 橙色
$copyCard: #bfbfbf; // 灰色
$emptyCard: #d9d9d9; // 浅灰色
$startCard: #ff4d4f; // 红色

// 使用这些变量
:export {
  approverCard: $approverCard;
  conditionCard: $conditionCard;
  starterCard: $starterCard;
  ccCard: $copyCard;
  emptyCard: $emptyCard;
  startCard: $startCard;
}

// 定义关闭按钮颜色变量
$closeButtonColor: #ff4d4f; // 红色，表示警告或取消操作
$closeButtonHoverColor: #c41d7f; // 较深的红色，用于悬停效果

// 使用这些变量
:export {
  closeButtonColor: $closeButtonColor;
  closeButtonHoverColor: $closeButtonHoverColor;
}
